<script setup lang="ts">

import StoreCardSimple from '@/components/StoreCardSimple.vue'
import { useRouter } from 'vue-router'
const router = useRouter()
const goToPayment = () => {
  router.push('/storeinformation')
}
const store = [
  {
    title: '万家饺子',
    imageUrl: 'src/assets/pic/sj01.png',
    description: "各种饺子、各种口味"
  },
  {
    title: '小锅饭豆腐馆',
    imageUrl: 'src/assets/pic/sj02.png',
    description: "特色美食"
  },
  {
    title: '麦当劳麦乐送',
    imageUrl: 'src/assets/pic/sj03.png',
    description: "汉堡薯条"
  },
  {
    title: '米村拌饭',
    imageUrl: 'src/assets/pic/sj04.png',
    description: "各种炒菜拌饭"
  },
  {
    title: '申记串道',
    imageUrl: 'src/assets/pic/sj05.png',
    description: "烤串炸串"
  },
  {
    title: '半亩良田排骨米饭',
    imageUrl: 'src/assets/pic/sj06.png',
    description: "排骨米饭套餐"
  },
  {
    title: '茶兮鲜果饮品',
    imageUrl: 'src/assets/pic/sj07.png',
    description: "甜品饮品"
  },
  {
    title: '唯一水果捞',
    imageUrl: 'src/assets/pic/sj08.png',
    description: "新鲜水果"
  },
  {
    title: '满园春饼',
    imageUrl: 'src/assets/pic/sj09.png',
    description: "鲜花饼"
  },
]
</script>

<template>
  <div
    class="w-full h-12vw bg-blue-500 text-white text-4.8vw fixed left-0 top-0 z-1000 flex justify-center items-center">
    商家列表
  </div>
  <div class="p-4">
    <store-card-simple
      v-for="infomation in store"
      :key="infomation.title"
      :title="infomation.title"
      :image-url="infomation.imageUrl"
      :description="infomation.description"
      @click="goToPayment">

    </store-card-simple>
  </div>
</template>
